Visual Studio Code ⼊⻔指北
介绍
vscode 是由微软团队推出的一款开源的代码编辑
器,有丰富的扩展。
为什么使用 vs code?
扩展支持C/C++的开发:
同时vs code 内置 Emmet 支持,前端是再合适不过
了:
除此之外,丰富的扩展还能支持其他语言的开发:
重构功能(快捷键 F2 ):
chundot 2022年04⽉07⽇ 14:16
原创
⽯麟之光
下载及安装
下载
官方下载地址: code.visualstudio.com
安装
下载完成后,双击运行开始安装:
1. 选择同意此协议,下一步;
2. 选择你希望安装的目录,下一步;
3. 可以更改你希望的开始菜单名或禁止创建开始菜
单,下一步;
4. 各个选项按你自己需要选择,通常情况下默认即
可,下一步;
5. 开始安装,等待完成即可。
快速开始
安装中文
第一次运行 vscode 时,右下角通知有提醒,可以直
接安装并重启,界面就变成中文了。
或者你可以点选左侧工具栏的扩展(最下面)图标,搜
索框输入 Chinese,安装安装次数最高的那个语言插
件并重启。
创建第一个项目
你可以随意的选择一个你希望保存你所有代码的目
录,创建一个新的文件夹,在 vscode 中单击文件--
打开文件夹选择新创建的文件夹并打开。
然后选择是,我信任此作者即可。
项目内创建文件夹或文件
点选左侧工具栏的资源管理器选项卡,或按下默认的
快捷键: Ctrl + Shift + E 。
红框四个图标代表新建文件、新建文件夹、刷新资源
管理器,折叠文件夹(文件夹内容较多时有用)。
你也可以右击蓝线内区域进行操作。
我们可以先新建一个 index.html 。
编辑代码
你可以单击或双击资源管理器的文件使其显示在编辑
器中。点选我们刚创建的 index.html (可能已经打开
了),在右侧即可开始编写代码。
对于 HTML 和 CSS,vscode 内置了emmet,非常
高效的前端代码片段合集。我们之后将会更加详细讲
解这部分功能。
在这里查阅 emmet 的奇技淫巧!
当然,其他的语言也会有高效的代码片段,你也可以
在扩展中找到各式各样的代码片段包!
通用插件
这里主要介绍基本都会用到的插件。
One Dark Pro
个人比较喜欢的编辑器配色插件。有三种方案可选。
当然,vscode 有好几种自带的配色方案,如果你觉
得自带够用,你完全可以不安装这个插件!
vscode-icons
非常棒的图标库,为 vscode 添加及更新了许多文件
和文件夹的图标(文件根据后缀名,文件夹根据名称
自动更改图标)。
常用快捷键
编辑或查找快捷键
想要编辑快捷键或查看相关命令,你可以按下 Ctrl +
K 再按下 Ctrl + S 。
比如,我想找与括号相关的快捷键,我可以输入
bracket 模糊搜索:
就找到了!有些操作按键默认留空,你可以为其分配
你自己喜欢的快捷键。
常用快捷键介绍
下面介绍一些比较常用的快捷键。
编辑器操作
保存
Ctrl + s
你懂的。当然你也可以在下面提到的设置中配置自动
保存。
代码提示
Ctrl + i
有时候 vscode 的代码建议不会自动跳出。
每当你看不到代码提示感到心慌的时候,就按一下。
移动行
Alt + ↑ 将代码向上移动一行。
Alt + ↓ 将代码向下移动一行。
复制行
Shift + Alt + ↑ 或 Shift + Alt + ↓ ,方向键决定向上或向
下。
复制光标
Ctrl + Alt + ↑ 或 Ctrl + Alt + ↓ ,方向键决定向上或向
下。
要同时对多行进行编辑的时候比较实用。
其他操作
显示命令面板
Ctrl + Shift + p
主题更改,扩展管理,编辑操作,文件格式化……所
有命令操作都可以在这里执行。
常用设置编辑
你可以点选左侧工具栏最下方的设置图标找到设置选
项。
你可以使用快捷键 Ctrl + , 打开 vscode 的设置选项。
XX 时格式化
搜索框搜索Format On:
比较推荐勾选Format On Save,保存时自动使用文
件默认的格式化程序。
自动保存
搜索框搜索Auto Save:
阅读原⽂
将光标移到选项上下方会有相应的说明,选择你喜欢
的就行。
一般不太推荐开启,经常 Ctrl + s 也没有多麻烦。
关于计算机协会
浙 ⼤ 宁 波 理 ⼯ 学 院 计 算 机 协 会 成 ⽴ 于 2 0 0 2 年 , 堪 称
学 校 “ 元 ⽼ 级 ” 社 团 。 现 为 数 据 学 院 最 ⼤ , 实 ⼒ 最 雄 厚 的
社团。
协 会 本 着 ” 联 合 ⼴ ⼤ 计 算 机 爱 好 者 , 普 及 计 算 机 知
识,提⾼计算机应⽤⽔平“ 的宗旨,⻓期为全校师⽣提供
计 算 机 知 识 教 学 , 电 脑 义 诊 , ⼿ 机 笔 记 本 升 级 以 及 选 购
等服务。
关注我们定期举办的理工维修日(不仅仅是维
修),成为志愿者,或是来这里进行软件配置问
题和硬件咨询,我们非常欢迎!
计协有自己的博客啦:https://www.nbtca.spac
e。也可以点下方“阅读原文”跳转到博客地址。
审核:templari jolan